import React, { Component } from 'react'
import Context from '../../utils/context'
export default class Alert2 extends Component {
    state = { typeIndex: 0 }
    static contextType=Context;
    render() {
        console.log(this.context);
        let {con: { type1, type2 }}=this.context.context;
        let { setN, bottomani,closeAlert1 } = this.context
        return (
            <div className={`Alert2 animate__animated ${bottomani}`}>
                <h2 onClick={closeAlert1}>关闭</h2>
                <div>
                    <h3>{type1.title}</h3>
                    <span className='active'>{type1.con.name}</span>
                    {type2.con.map((item, index) => { return <span className={this.state.typeIndex === index ? 'active' : null} key={index} onClick={() => { this.setState({ typeIndex: index }) }}>{item.name}</span> })}
                    <p>
                        <button onClick={()=>{setN();closeAlert1()}}>购买</button> &nbsp;
                        <button onClick={closeAlert1}>取消</button>
                    </p>
                </div>
            </div>
        )
       
    }
    
}
